<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8">
    <script src="http://lib.sinaapp.com/js/jquery/2.0.2/jquery-2.0.2.min.js"></script>
</head>
<!-- <style>
/* 利用浮动 */
    body {
        min-width: 550px;
        /* 2x leftContent width + rightContent width */
        font-weight: bold;
        font-size: 20px;
    }
    
    #header,
    #footer {
        background: rgba(29, 27, 27, 0.726);
        text-align: center;
        height: 60px;
        line-height: 60px;
    }
    
    #footer {
        clear: both;
    }
    
    #container {
        padding-left: 200px;
        /* leftContent width */
        padding-right: 150px;
        /* rightContent width */
        overflow: hidden;
    }
    
    #container .column {
        position: relative;
        float: left;
        text-align: center;
        height: 300px;
        line-height: 300px;
    }
    
    #center {
        width: 100%;
        background: rgb(206, 201, 201);
    }
    
    #left {
        width: 200px;
        /* leftContent width */
        right: 200px;
        /* leftContent width */
        margin-left: -100%;
        background: rgba(95, 179, 235, 0.972);
    }
    
    #right {
        width: 150px;
        /* rightContent width */
        margin-right: -150px;
        /* rightContent width */
        background: rgb(231, 105, 2);
    }
</style> -->
<style>
    #header {
        height: 100px;
        text-align: center;
        line-height: 100px;
        background-color: grey;
    }
    
    #footer {
        height: 100px;
        text-align: center;
        line-height: 100px;
        background-color: grey;
    }
    
    #container {
        display: flex;
        height: 200px;
    }
    
    #left {
        width: 200px;
        background-color: blue;
    }
    
    #right {
        width: 200px;
        background-color: green;
    }
    
    #center {
        flex: 1;
        background-color: pink;
    }
</style>

<body>
    <div id="header">#header</div>
    <div id="container">

        <div id="left" class="column">#left</div>
        <div id="center" class="column">#center</div>
        <div id="right" class="column">#right</div>
    </div>
    <div id="footer">#footer</div>


</body>

</html>